.tab-box {
  span {
    display: inline-block;
    border: 1px solid #ddd;
    margin-right: 20px;
    padding: 10px;
    cursor: pointer;
  }
}

.first-container {
  width: 100%;
  columns: 3;
  column-gap: 8px;
  img {
    width: 100%;
    break-inside: avoid;
  }
}

.second-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  grid-auto-rows: 2px;
  img {
    width: 100%;
  }
}

.third-container {
  display: flex;
  gap: 8;
  .column {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 8px;
  }
  img {
    width: calc(100% - 8px);
  }
}

.my-masonry-grid {
  display: flex;
  margin-left: -10px; /* 抵消内列间距 */
  width: auto;
  img {
    width: 100%;
    vertical-align: top;
    margin-bottom: 10px;
  }
}
.my-masonry-grid_column {
  padding-left: 10px; /* 内列间距 */
  background-clip: padding-box;
}